/**
 * drag方法
 */

import { DraggleLayoutProps } from "@/components/DraggleLayout";

export const drag = ({ leftDom, rightDom, contentDom }: DraggleLayoutProps, draggleLineDom?: HTMLDivElement | null) => {
  (draggleLineDom as HTMLDivElement).onmousedown = (e: MouseEvent) => {
    const dir = "horizontal";
    const firstX = e.clientX;
    const width = (rightDom as HTMLDivElement).offsetWidth;

    document.onmousemove = (e: MouseEvent) => {
      switch (dir) {
        case "horizontal":
          (leftDom as HTMLDivElement).style.width = `${(contentDom as HTMLDivElement).offsetWidth - width + (e.clientX - firstX) - 2}px`;
          (rightDom as HTMLDivElement).style.width = `${width - (e.clientX - firstX)}px`;
          break;
        default:
          break;
      }
    };

    document.onmouseup = () => {
      document.onmousemove = null;
      document.onmouseup = null;
    };
    return false;
  };
};
